/* components/Home/Home.wxss */
.home_item {
  width: 700rpx;
  margin: 20rpx auto;
  background-color: #fff;
  padding: 40rpx 30rpx;
  box-sizing: border-box;
  border-radius: 20rpx;
  font-size: 34rpx;
  font-weight: 400;
  position: relative;
  background-repeat:no-repeat;
  background-size: 50%;
  background-position: right bottom;
  // box-shadow: 8rpx 8rpx 38rpx rgba(196, 194, 194, .6);
  // filter: drop-shadow(0rpx 0rpx 8rpx rgba(196, 194, 194, .6));
  background-image: url('');
  .item_title {
    font-size: 40rpx;
    font-weight: 500;
  }
  .item_tab {
    margin-top: 30rpx;
    display: flex;
    position: relative;
    justify-content: space-between;
    .tab_item {
      flex: 1;
      text-align: center;
    }
    .tab_active {
      position: absolute;
      width: 0;
      height: 0;
      border-left: 16rpx solid transparent;
      border-right: 16rpx solid transparent;
      border-bottom: 20rpx solid rgb(165, 13, 13);
      bottom: -26rpx;
      transition: all .3s;
      left: calc(107rpx - 16rpx);
      filter: drop-shadow(2rpx 2rpx 4rpx rgb(165, 13, 13));
    }
    .tab_item_active {
      color: rgb(165, 13, 13);
      font-weight: 600;
    }
  }
  .item_content {
    margin-top: 50rpx;
    .content_title {
      .title_qi {
        font-size: 40rpx;
        font-size: 600;
        margin-right: 20rpx;
      }
      .title_ri {
        color: rgb(83, 82, 82);
        font-size: 30rpx;
      }
    }
    .content_list {
      display: flex;
      padding: 40rpx 0;
      box-sizing: border-box;
      flex-wrap: wrap;
      .list_item {
        margin-bottom: 20rpx;
        border-radius: 50%;
        // background-color: red;
        width: 60rpx;
        height: 60rpx;
        line-height: 60rpx;
        text-align: center;
        color: #fff;
        font-weight: 500;
        font-size: 34rpx;
        margin-right: 22rpx;
        background: radial-gradient(circle at 70rpx 70rpx,#bb1b36,#ff0138); 
        filter: drop-shadow(4rpx 4rpx 4rpx red);
      }
      .list_item_blue {
        background: radial-gradient(circle at 70rpx 70rpx,#091fa0,#0ca5ec);
        filter: drop-shadow(4rpx 4rpx 4rpx #091fa0);
      }
      .list_item:last-child {
        margin-right: 0;
      }
    }
  }
  .item_detail {
    text-align: center;
    border-top: 2rpx dashed rgba(206, 200, 200, .5);
    padding-top: 30rpx;
    position: relative;
    color: rgb(55, 77, 109);
    &::before,
    &::after {
      content: '';
      width: 50rpx;
      height: 50rpx;
      background-color: var(--bg);
      position: absolute;
      border-radius: 50%;
      top: -25rpx;
    }
    &::before {
      left: -55rpx;
    }
    &::after {
      right: -55rpx;
    }

  }
}